<template>
    <view class="nova-column">
        <nova-pref class="li-pref" title="头像" placeholder="" :arrow="true">
            <view class="picker" @click="pickImg('headimg')">
                <image v-if="info.headimg" class="profile" :src="info.headimg"></image>
                <text class="placeholder" v-else>点击选择头像</text>
            </view>
        </nova-pref>
        <nova-pref class="li-pref" title="公司名称" placeholder="请填写公司名称" :arrow="false" type="input" name="name" :value="info.name" @input="input"></nova-pref>
        <nova-pref
            class="li-pref"
            title="注册电话"
            placeholder="请填写公司注册电话"
            :arrow="false"
            type="text"
            name="phone"
            :value="info.phone"
            inputType="number"
            @input="input"
        ></nova-pref>
        <nova-pref
            class="li-pref"
            title="联系电话"
            placeholder="请填写公司联系电话"
            :arrow="false"
            type="input"
            name="contact"
            :value="info.contact"
            inputType="number"
            @input="input"
        ></nova-pref>
        <!--        <nova-pref
            class="li-pref"
            title="公司地址"
            placeholder="请选择公司所在地址"
            :arrow="true"
            type="text"
            name="company_address"
            :value="info.company_address"
            @click.native="goMap"
        ></nova-pref> -->
        <choose-location class="li-pref" title="公司地址" placeholder="请选择公司所在地址" :loc="loc" @change="goMap" />
        <view class="nova-column" style="padding: 0 34rpx;">
            <text class="title">公司介绍</text>
            <textarea v-model="info.companyIntroduce" class="ta"></textarea>
<!--            <text class="title">公司营业执照</text>
            <view class="nova-flex nova-flex-center" @click="pickImg('companyLicense')">
                <image v-if="info.companyLicense" :src="info.companyLicense" style="width: 636rpx; height: 362rpx;"></image>
                <view v-else class="nova-column" style="position: relative; align-items: center;">
                    <image src="../../static/gs/yyzz.png" style="width: 318rpx; height: 181rpx;"></image>
                    <image src="../../static/gs/yyzz_add.png" style="width: 73rpx; height: 73rpx; position: absolute; left: 123rpx; top:54rpx;"></image>
                    <text style="color: #999999; font-size: 24rpx; padding-top: 13rpx;">上传公司营业执照</text>
                </view>
            </view> -->

            <button class="save btn-primary" @click="save">保存</button>
        </view>
    </view>
</template>

<script>
import NovaPref from '../../components/nova/pref.vue';
import ChooseLocation from '../c/choose-location.vue';
export default {
    components: {
        NovaPref,
        ChooseLocation
    },
    data() {
        return {
            info: {},
            openid: this.$global.openid,
            loc: {
                latitude: '',
                longitude: '',
                name: '',
                address: '',
                areaid: ''
            }
        };
    },
    methods: {
        async loadData() {
            let res = await this.$request.post({
                url: '/user/userbasic',
                data: {
                    openid: this.openid,
                    type: this.$global.role
                }
            });
            this.info = res;
            if (res.latitude) {
                this.loc.latitude = res.latitude;
            }
            if (res.longitude) {
                this.loc.longitude = res.longitude;
            }
            if (res.company_address || res.village) {
                this.loc.name = res.company_address || res.village;
            }
            
            // #ifdef H5
            if (!this.loc.company_address) {
                this.loc.company_address = '北京东路63号';
                this.loc.latitude = 32.050678;
                this.loc.longitude = 118.792198;
            }
            // #endif
        },
        input(e) {
            let k = e.target.name;
            this.info[k] = e.detail.value;
        },
        goMap(res) {
            console.log('change loc', res);
            let _this = this;
            _this.info.company_address = res.name;
            _this.loc = {
                latitude: res.latitude,
                longitude: res.longitude,
                name: res.name,
                address: res.address
            };
            this.info.latitude = res.latitude;
            this.info.longitude = res.longitude;
        },
        pickImg(key) {
            var that = this;
            uni.chooseImage({
                count: 1,
                success: function(res) {
                    console.log(res);
                    let path = res.tempFilePaths[0];
                    //that.info[key] = path;
                    that.upload(key, path);
                }
            });
        },
        async upload(key, f) {
            var that = this;
            let res = await this.$request.upload({
                url: '/user/uploadPic',

                filePath: f,
                name: 'file',
                loadingTip: '上传中，请稍候',
                formData: {}
            });
            console.log(res);
            let url = res[0].url;
            console.log(key, url);
            that.info[key] = url;
            return;
        },
        async save() {
            let form = {
                headimg: this.info.headimg,
                company_name: this.info.name,
                company_telephone: this.info.contact,
                company_address: this.info.company_address,
                latitude: this.loc.latitude,
                longitude: this.loc.longitude,
                company_introduce: this.info.companyIntroduce,
                //company_license: this.info.companyLicense
            };
            let err;
            if (!form.company_name) {
                err = '请输入公司名称';
            } else if (!form.company_telephone) {
                err = '请输入联系电话';
            } else if (!form.company_address) {
                err = '请输入公司地址';
            } else if (!form.company_introduce) {
                err = '请输入公司简介';
            } else if (!form.company_license) {
                //err = '请上传公司营业执照';
            } else if (!this.$isMobile(form.company_telephone)) {
                err = '联系电话不是一个有效的手机号码';
            }
            if (err) {
                this.$toast(err);
                return;
            }
            console.log('post', form);
            let res = await this.$request.post({
                url: '/user/businessInformation',
                data: form,
                loadingTip: '正在提交，请稍候...'
            });
            //this.info = res;
            this.$toast('信息保存成功');
            this.$getUserBasic();
        }
    },
    onLoad() {
        // #ifdef H5
        this.openid = 'oUtyp5XJTdgNm8RsGRgkrlEVWD3Y';
        // #endif
        this.loadData();
    }
};
</script>

<style>
page {
    color: #999999;
}

.picker {
    width: 100%;
    text-align: right;
}

image.profile {
    width: 64rpx;
    height: 64rpx;
    border-radius: 22rpx;
    margin-right: 10rpx;
}

.title {
    line-height: 130rpx;
    color: #999999;
    font-size: 30rpx;
}

.ta {
    width: 100%;
    height: 300rpx;
    border: 1rpx solid rgba(229, 229, 229, 1);
    border-radius: 10rpx;
    padding: 22rpx 38rpx;
    font-size: 28rpx;
}

.save {
    height: 100rpx;
    line-height: 100rpx;
    margin: 64rpx 0;
}
</style>
